<template>
  <div>


    <van-row>
      <van-col span="6"><lef></lef></van-col>
      <van-col span="18">
        <van-row>
          <van-col span="24"><headers></headers></van-col>
        </van-row>
        <van-row>
          <van-col span="8">
            <van-field
              v-model="name"
              name="name"
              label="请输入名称"
              placeholder="请输入组织名称"
              :rules="[{ required: true, message: '请输入组织名称' }]"
          /> </van-col>
          <van-col span="3"><van-button type="info" @click="sousuo">查询</van-button></van-col>
          {{msg1}}
          <van-col span="5"><van-button disabled type="primary">重置</van-button>
          </van-col>

        </van-row>
        <van-row>
          <van-col span="2">
            <van-button type="info" @click="add_show">新增</van-button>
          </van-col>
          <van-col span="2">
            <van-button disabled type="primary" @click="exporta">导出</van-button>
          </van-col>
          <van-col span="2">
            <van-uploader :after-read="afterRead" multiple accept=".xls">导入</van-uploader>
          </van-col>
        </van-row>
        <van-row>
          <div v-show="show_1">
            <van-button plain type="primary" @click="ss">取消</van-button>
            <van-form @submit="onSubmit">
              <van-field
                  v-model="form.name"
                  name="name"
                  label="组织名称"
                  placeholder="组织名称"
                  :rules="[{ required: true, message: '请输入组织名称' }]"
              />
              <van-field name="status" label="单选框">
                <template #input>
                  <van-radio-group v-model="form.status" direction="horizontal">
                    <van-radio name="1">企业</van-radio>
                    <van-radio name="2">部门</van-radio>
                  </van-radio-group>
                </template>
              </van-field>
              <van-field
                  v-model="form.zzsuoxie"
                  name="zzsuoxie"
                  label="组织缩写"
                  placeholder="组织缩写"
                  :rules="[{ required: true, message: '请输入组织缩写'}]"
              />
              <van-field
                  v-model="form.sort"
                  name="sort"
                  label="组织排序"
                  placeholder="组织排序"
              />
              <div style="margin: 16px;">
                <van-button round block type="info" native-type="submit">提交</van-button>
              </div>
            </van-form>
          </div>
          <br>
          <br>
        <div>

          <el-tree
              :data="zuzhi_list"
              show-checkbox
              node-key="id"
              :default-expanded-keys="[2, 3]"
              :default-checked-keys="[5]"
              :props="defaultProps"
          />

        </div>
        </van-row>
      </van-col>
    </van-row>


  </div>
</template>

<script>
import myaxios from "axios";
import Lef from "@/components/veiw/lef";
import headers from "@/components/veiw/headers";

export default {
  name: "zuzhi",
  components: {headers, Lef},
  data() {
    return {
      data1: '',
      show_1:false,
      form:{},
      name:'',
      zuzhi_list:[],
      defaultProps: {
        children: 'son',
        label: 'name',
      },
      msg1:'',

    }
  },
  methods: {
    add_show(){
      this.show_1 = true
    },
    ss(){
      this.show_1 = false
    },
    onSubmit(values) {
      myaxios({url:'http://127.0.0.1:5000/zuzhi',method:'post',data:values}).then(res=>{
        alert(res.msg)
      })
    },
    get_zuzhi(){
      myaxios({url:'http://127.0.0.1:5000/zuzhi',method:'get'}).then(res=>{
        console.log(res.data.list)
        this.zuzhi_list = res.data.list
      })
    },
    afterRead(file){
      let formdate = new FormData()
      formdate.append('file',file.file)
      console.log(formdate)
      myaxios({url:'http://127.0.0.1:5000/datafile',method:'post',data:formdate}).then(res=>{
        alert(res.data.msg)
      })
    },
    exporta(){
      myaxios({url:'http://127.0.0.1:5000/download',method:'get'}).then(res=>{
        console.log(res)
      })
    },
    sousuo(){
      myaxios({url:'http://127.0.0.1:5000/zuzhi',method:'get',params:{name:this.name}}).then(res=>{
        console.log(res.data.list)
        this.msg1 = res.data.list
      })
    }
  },
  mounted() {
    this.get_zuzhi()
  }
}
</script>

<style scoped>

</style>